<template>
	<!-- 项目信息导入-维护设备明细组件 -->
	<div>
		<!-- 赋值权限 -->
		<v-dialog v-model="equiModel.dialog" width="1400">
			<v-card>
				<v-card-title>维护设备清单</v-card-title>
				<v-card-text>
					<v-container>
						<v-row>
							<v-col cols="6">
								<v-alert text color="blue-grey">录入设备基本信息</v-alert>
								<v-row>

									<v-col cols="12" md="12">
										<bomselect :bomSelectModel="bomSelectModel" :callBack="setBomCallBack">
										</bomselect>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.code" :style="tempBom" label="设备编号" disabled
											outlined dense></v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.name" label="设备名称" disabled outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.model" label="设备型号" disabled outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.qty" :rules="qtyRule" label="设备数量(必填)" outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.price" :rules="qtyRule" label="设备价格(必填)" outlined dense>
										</v-text-field>
									</v-col>
									
									<v-col cols="12" md="4">
										<v-combobox v-model="Model.unit" :return-object="false" :items="unitItems"
											label="单位" outlined chips dense></v-combobox>
									</v-col>
									
									<!-- 	<v-col cols="12" md="4">
										<v-text-field v-model="Model.design_username" label="设计人员" outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.check_username" label="核对人员" outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.versioncode" label="版本号" outlined dense>
										</v-text-field>
									</v-col>
									<v-col cols="12" md="4">
										<v-text-field v-model="Model.machinecode" label="机台号" outlined dense>
										</v-text-field>
									</v-col> -->

								<!-- 	<v-col cols="12">
										<v-row>
											<v-col cols="12" md="5">
												<v-text-field v-model="Model.customercode" :style="tempCustomer" disabled label="客户编码" outlined dense>
												</v-text-field>
											</v-col>
											<v-col cols="12" md="5">
												<v-text-field v-model="Model.customername"  disabled label="客户名称" outlined dense>
												</v-text-field>
											</v-col>
											<v-col cols="12" md="2">
												<v-btn tile color="primary" @click="checkCustomerClick">选择客户</v-btn>
											</v-col>
										</v-row>
									</v-col> -->
									<v-col cols="12">
										<uploadfile :UpLoad="UpLoad" :callBackPath="equiUploadFileCallBack">
										</uploadfile>
									</v-col>

									<v-col cols="12">
										<v-textarea outlined name="input-7-4" label="描述" v-model="Model.description"
											:value="Model.description">
										</v-textarea>
									</v-col>
								</v-row>
							</v-col>
							<v-divider vertical></v-divider>
							<v-col cols="6">
								<v-alert text color="blue-grey">设备清单</v-alert>
								<v-data-table :headers="equiDataHeaderList" :items="equiDataList" small fixed-header
									item-key="id" dense class="text-no-wrap" loading-text="正在加载请稍等......"
									:footer-props="vuetifyDefaultPage">
									<!-- 	<template v-slot:expanded-item="{ headers, item }">
										<td :colspan="headers.length">
											<v-data-table v-if="item.permissionList!=null" :headers="[
												{text: '类型',
												 value: 'approvaltypename',
												 align:'left',
												 	filterable: true,
												},
													{text: '审批状态',
													 value: 'approvalstatusname',
													 align:'left',
													 	filterable: true,
													},
													{text: '审批人',
													 value: 'approvalusername',
													 align:'left',
													 filterable: true,
													},
													{text: '审批回复',
											     value: 'approvaldescription',
											     align:'left',
													 filterable: true,
													},
													{text: '申请审批描述',
											     value: 'applydescription',
											     align:'left',
													 filterable: true,
													 }
													]" :items="item.permissionList" small fixed-header item-key="id" dense class="text-no-wrap"
												:footer-props="vuetifyDefaultPage">
											</v-data-table>

										</td>
									</template> -->
									<template v-slot:item.actions="{ item }">
										<div>
											<v-btn class="ml-2" small tile color="primary" @click="Model=item">
												编辑
											</v-btn>
											<v-btn class="ml-2" small tile color="red" @click="deleteEqui(item)">
												删除
											</v-btn>
										</div>
									</template>
								</v-data-table>
							</v-col>
						</v-row>
					</v-container>
					<v-card-actions>
						<v-spacer></v-spacer>
						<v-btn color="primary" class="mr-4" small tile @click="nextAdd">确定
						</v-btn>
						<v-btn color="success" class="mr-4" small tile @click="equiAuditSubmit">提交审核
						</v-btn>
						<v-btn color="warning" class="mr-4" small tile @click="close">取消</v-btn>

					</v-card-actions>
				</v-card-text>
			</v-card>
		</v-dialog>
		<customerDataList :customerCommentModel="customerCommentModel" :callBack="checkCustomerCallBack">
		</customerDataList>
	</div>
</template>

<script>
	import bomselect from '../../BomSelect.vue'
	import customerDataList from '../../CustomerDataList.vue'
	import uploadfile from '../../../../mes/components/UploadFile.vue'
	export default {
		name: 'info_manage_equi_maintenance',
		components: {
			bomselect: bomselect,
			uploadfile: uploadfile,
			customerDataList: customerDataList
		},
		props: {
			callBack: {
				type: Function, //参数类型：函数
			},
			equiModel: {
				dialog: false,
				projectId: 0
			},
		},
		data: () => ({
			Model: {},
			assemblydateMenu: false,
			qtyRule: [
				v => /^[0-9]*$/.test(v) || '请输入合法数字',
				v => v >= 0 || '需求量不能小于0'
			],
			equiDataHeaderList: [{
					text: '编辑',
					align: 'center',
					value: 'actions',
					filterable: false,
					class: 'fixed'
				},
				{
					text: '设备编号',
					align: 'center',
					value: 'code',
					filterable: false,
					class: 'fixed'
				},
				{
					text: '设备名称',
					align: 'center',
					value: 'name',
					filterable: false,
					class: 'fixed'
				}, {
					text: '数量',
					align: 'center',
					value: 'qty',
					filterable: false,
					class: 'fixed'
				}, {
					text: '单位',
					align: 'center',
					value: 'unit',
					filterable: false,
					class: 'fixed'
				},
				
				{
					text: '型号',
					align: 'center',
					value: 'model',
					filterable: false,
					class: 'fixed'
				},
				{
					text: '客户名称',
					align: 'center',
					value: 'customername',
					filterable: false,
					class: 'fixed'
				},
				{
					text: '客户编码',
					align: 'center',
					value: 'customercode',
					filterable: false,
					class: 'fixed'
				},
				// {
				// 	text: '版本号',
				// 	align: 'center',
				// 	value: 'versioncode',
				// 	filterable: false,
				// 	class: 'fixed'
				// },
				// {
				// 	text: '机台号',
				// 	align: 'center',
				// 	value: 'machinecode',
				// 	filterable: false,
				// 	class: 'fixed'
				// },
				// {
				// 	text: '设计人员名称',
				// 	align: 'center',
				// 	value: 'design_username',
				// 	filterable: false,
				// 	class: 'fixed'
				// },
				// {
				// 	text: '核对人员名称',
				// 	align: 'center',
				// 	value: 'check_username',
				// 	filterable: false,
				// 	class: 'fixed'
				// },
				{
					text: '描述',
					align: 'center',
					value: 'description',
					filterable: false,
					class: 'fixed'
				},
				{
					text: '审批类型',
					value: 'approval.approvaltypename',
					align: 'left',
					filterable: true,
				},
				{
					text: '审批状态',
					value: 'approval.approvalstatusname',
					align: 'left',
					filterable: true,
				},
				{
					text: '审批人',
					value: 'approval.approvalusername',
					align: 'left',
					filterable: true,
				},
				{
					text: '审批回复',
					value: 'approval.approvaldescription',
					align: 'left',
					filterable: true,
				},
			],
			equiDataList: [],
			equiLoading: false,
			equiTotalCount: 0,
			equiOptions: { //页数
				page: 1,
				//每页行数
				itemsPerPage: 10
			},
			vuetifyDefaultPage: {
				'items-per-page-text': '每页个数',
				'items-per-page-options': [10, 20, 50, 100]
				// 'items-per-page-all-text': '100'
			},
			unitItems: [],
			bomSelectModel: {
				loadBOMUrl: `PDM/PDMInfoManage/LoadBomToSelect`,
			},
			tempBom: {},
			UpLoad: {
				isUploadSingleImage: false,
				isUploadMultipleFiles: true,
				type:30
			},
			customerCommentModel: {
				dialog: false,
				loadCustomerUrl: ``
			},
			tempCustomer:{}
		}),
		watch: {
			equiModel: {
				handler(newVal) {
					this.$emit('update:equiModel', newVal)
					this.loadProjectEquis()
				},
				deep: true
			},
		},

		methods: {
			async loadUnits() {
				var response = await this.$httpRequest({
					url: `PDM/PDMInfoManage/loadUnits`,
					method: 'get',
				})
				if (response.status == 1) {
					this.unitItems = response.data
				}
			},
			async loadProjectEquis() {
				if (!this.equiModel.dialog) {
					return
				}
				await this.loadUnits()
				var response = await this.$httpRequest({
					url: `PDM/PDMInfoManage/LoadEquis?projectId=${this.equiModel.projectId}`,
					method: 'get',
				})
				if (response.status == 1) {
					this.equiDataList = response.data
				}
			},
			//确定
			async nextAdd() {
				var url;

				if (this.Model.id > 0) {
					url = `PDM/PDMInfoManage/UpdateEquipmentDetail`
				} else {
					url = `PDM/PDMInfoManage/AddEquipmentDetail`
				}
				this.Model.projectid = this.equiModel.projectId
				var response = await this.$httpRequest({
					url: url,
					method: 'post',
					data: this.Model
				})
				if (response.status == 1) {
					this.$message.success(response.info)
					this.Model = {}
					await this.loadProjectEquis()
				} else {
					this.$message.error(response.info)
				}

			},
			//提交审核
			async equiAuditSubmit() {
				var response = await this.$httpRequest({
					url: `PDM/PDMInfoManage/SubmitApproval?projectId=${this.equiModel.projectId}`,
					method: 'get',
				})
				if (response.status == 1) {
					this.close()
					this.$message.success(response.info)
					this.$props.callBack()
				} else {
					this.$message.error(response.info)
				}
			},
			async deleteEqui(item) {
				var response = await this.$httpRequest({
					url: `PDM/PDMInfoManage/DeleteEquipmentDetail?equiId=${item.id}`,
					method: 'get',
				})
				if (response.status == 1) {
					this.$message.success(response.info)
					await this.loadProjectEquis()
				} else {
					this.$message.error(response.info)
				}
			},
			checkCustomerClick() {
				this.customerCommentModel.dialog = true
				this.customerCommentModel.loadCustomerUrl = `PDM/PDMInfoManage/LoadCustomerPage`
			},
			//选中客户
			checkCustomerCallBack(customer) {
				this.tempCustomer=customer
				this.Model.customercode = customer.cCusCode
				this.Model.customername = customer.cCusName

			},
			//选中基础BOM
			setBomCallBack(bom) {
				this.tempBom = bom
				this.Model.bomid = bom.id
				this.Model.code = bom.value
				this.Model.name = bom.name
				this.Model.model = bom.model
			},
			//上传图纸
			equiUploadFileCallBack(fileinfos) {
				this.Model.picurl = JSON.stringify(fileinfos)
			},
			//关闭
			close() {
				this.equiModel.dialog = false
				this.Model = {}
			},
		}
	}
</script>
